<!DOCTYPE html>
<html lang="zh-cn">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <title>培训首页</title>


    <!-- Expand styles -->
    <link href="../css/app/app.css" rel="stylesheet">
    <link href="../css/app/default.css" rel="stylesheet">
    <link href="../css/mui/mui.css" rel="stylesheet">
    <link href="../css/mui/mui.picker.min.css" rel="stylesheet" />

</head>

<body>

    <!-- header -->
    <div class="mobile-content5">
        <img class="peixun-bg" src="../img/peixun-bg.png" alt="">
        <!-- 第一部分 -->
        <div class="peixun-theme">
            <div class="display-flex align-items-center justify-content-between padding-15 width-100 padding-b-10">
                <span class="blue-drop"></span>
                <span class="blue-drop"></span>
            </div>
            <div class="padding-15 padding-t-0">
                <div class="peixun-border peixun-input">
                    <div class="margin-lr55">
                        <input type="text" id="title" placeholder="我的培训主题">
                    </div>
                </div>
                <div class="display-flex justify-content-between align-items-end">
                    <div class="peixun-border peixun-input width-100 padding-l-55">
                        <input type="tel" id="tranPeopleNum" placeholder="我要培训的人数" maxlength="10"
                            onkeyup="this.value=this.value.replace(/\D/g,'')"
                            onafterpaste="this.value=this.value.replace(/\D/g,'')">
                    </div>
                    <span class="font-15 black margin-l-20 margin-r-20 w-50px">人</span>
                </div>
                <div class="display-flex justify-content-between align-items-end">
                    <div class="peixun-border peixun-input width-100 padding-l-55">
                        <input type="tel" id="connectPhone" placeholder="我的联系电话" maxlength="12" disabled
                            onkeyup='value=value.replace(/[^0-9\-]+/g,"")' />
                    </div>
                    <span class="font-15 black margin-l-20 margin-r-20 w-50px edit-phone">修改</span>
                </div>
                <div class="peixun-send" onclick="publishDemand()">
                    立即发布培训需求
                </div>
                <div class="display-flex justify-content-between align-items-center">
                    <div class="display-flex align-items-center">
                        <img class="pei-icon" src="../img/ji.png" alt="">
                        <span class="font-12 black">极速匹配</span>
                    </div>
                    <div class="display-flex align-items-center">
                        <img class="pei-icon" src="../img/you.png" alt="">
                        <span class="font-12 black">优质保障</span>
                    </div>
                    <div class="display-flex align-items-center">
                        <img class="pei-icon" src="../img/fang.png" alt="">
                        <span class="font-12 black">放心服务</span>
                    </div>
                </div>
            </div>
        </div>
        <div style="height:235px;"></div>
        <!-- 第二部分 -->
        <div class="peixun-serve  padding-15">
            <div class="display-flex align-items-center justify-content-between">
                <span class="px-line margin-b-10"></span>
                <p class="text-center font-13 font-weight black">平台已服务人数<span class="font-18 blue1"
                        id="tranPeopleNums"></span>人
                </p>
                <span class="px-line margin-b-10"></span>
            </div>

            <div class="display-flex justify-content-between">
                <div class="display-flex flex-column align-items-center width50 border-r">
                    <span class="gray font-12">已入驻培训机构</span>
                    <span class="black font-18 padding-t-5" id="settledNum"></span>
                </div>
                <div class="display-flex flex-column align-items-center width50">
                    <span class="gray font-12">已对接服务次数</span>
                    <span class="black font-18 padding-t-5" id="serviceTimes"></span>
                </div>
            </div>
        </div>
        <!-- 第三部分 -->
        <div class="widget-body widget-default margin-t-10 display-flex">
            <div class="width50 margin-r-10" onclick="goDemandList()">
                <img class="p1-img" src="../img/p1.png" alt="">
            </div>
            <div class="width50" onclick="goSuccessCaseList()">
                <img class="p1-img" src="../img/p2.png" alt="">
            </div>
        </div>
        <!-- 第四部分 -->
        <div class="widget-body widget-default margin-t-10">
            <div class="trade-list" onclick="goOrgList()">
                <div class="tit-label"></div>
                <div class="display-flex align-items-center justify-content-between margin-l-10">
                    <span class="black font-16 font-weight">优质培训服务机构</span>
                    <span class="font-15 gray1">更多&nbsp;></span>
                </div>
            </div>
        </div>
        <div class="widget-body widget-default padding-t-0">
            <div class="display-flex index-overflow">
                <div class="display-flex px-diffbg" id="goodOrgList">

                </div>

            </div>
        </div>
        <!-- 第五部分 -->
        <div class="widget-body widget-default margin-t-10">
            <div class="trade-list">
                <div class="tit-label"></div>
                <div class="display-flex align-items-center justify-content-between margin-l-10"
                    onclick="goSuccessCaseList()">
                    <span class="black font-16 font-weight">成功对接案例</span>
                    <span class="font-15 gray1">更多&nbsp;></span>
                </div>
            </div>
        </div>
        <div id="dataList">
        </div>
        <div class="dialog hide">
            <div class="mask"></div>
            <div class="dialog-content">
                <h3 class="title">请修改你的联系手机号码</h3>
                <p class="text">
                    <input type="text" class="dialog-input" style="width: 100%;" placeholder="请输入您的手机号码"
                        id="phoneNumber">
                    <input type="text" class="dialog-input" style="width: 60%;" placeholder="请输入验证码" id="verifyCode">
                    <button class="seed-btn">发送验证码</button>
                </p>
                <div class="btn-group">
                    <div class="btn cancel-btn">取消</div>
                    <div class="btn cancel-btn-save" style="color: #3F72FF;">确定</div>
                </div>
            </div>
        </div>
    </div>


    <script src="../js/jquery.js"></script>
    <script src="../js/mui/mui.js"></script>
    <script src="../js/mui/mui.picker.min.js"></script>
    <script src="../js/layer.js"></script>
    <script src="../js/app/app-base.js"></script>
    <script src="../js/app/app-url.js"></script>
    <script src="../js/app/app-ajax.js"></script>
    <script src="../js/dsbridge.js"></script>
    <script>
        var subUserType = '';
        var mWait = 60; //验证码等待时间
        var pWait = 0; //验证码当前时间

        $(document).ready(function () {
            //获取统计数值
            getTrainingNeedsIndex();
            //获取优质培训服务机构
            getGoodOrg();
            //获取对接成功案例
            getCaseList();
            dsBridge.register('setTel', function (tel) {
                $("#connectPhone").val(tel);
            })
        })

        function checkSMSVerifyCode(phoneNumber, verifyCode) {
            var data = {
                phoneNumber: phoneNumber,
                verifyCode: verifyCode
            }
            getServerData(url_checkSMSVerifyCode, data);

        }

        function sendVerifyCode() {
            var phoneNumber = $("#phoneNumber").val();
            if (isEmpty(phoneNumber)) {
                showToast("请输入手机号");
                return;
            }
            if (!checkPhone(phoneNumber)) {
                return;
            }

            
            var data = {
                phoneNumber: phoneNumber
            }
            getServerData(url_sendVerifyCode, data);
        }

        function saveVerifyCode() {
            var phoneNumber = $("#phoneNumber").val();
            var verifyCode = $("#verifyCode").val();
            if (isEmpty(phoneNumber)) {
                showToast("请输入手机号");
                return;
            }
            if (isEmpty(verifyCode)) {
                showToast("请输入验证码");
                return;
            }



        }

        //获取统计数值
        function getTrainingNeedsIndex() {
            var data = {}
            getServerData(url_trandemandmgr_getTrainingNeedsIndex, data);
        }

        //获取优质培训服务机构
        function getGoodOrg() {
            var data = {}
            getServerData(url_trainorgmgr_getTrainOrganization, data);
        }


        //获取对接成功案例
        function getCaseList() {
            var data = {
                sourceType: 'web',
                userId: getUserId(),
                confirmStatus: 3,
                page: 1,
                limit: 2
            }
            getServerData(url_trandemandmgr_queryList, data);
        }

        //发布培训需求
        function publishDemand() {

            //判断是否为培训机构
            if (localStorage.getItem("is-org") == "1") {
                showToast("培训机构用户不能发布需求");
                return;
            }


            var title = $("#title").val();
            var tranPeopleNum = $("#tranPeopleNum").val();
            var connectPhone = $("#connectPhone").val();
            if (isEmpty(title)) {
                showToast("请输入培训主题");
                return;
            }
            if (isEmpty(tranPeopleNum)) {
                showToast("请输入培训人数");
                return;
            }
            // if(Number(tranPeopleNum) <= 0 ){
            //     showToast("请输入正确培训人数");
            //     return;
            // }
            if (isEmpty(connectPhone)) {
                showToast("请输入联系电话");
                return;
            }
            // //培训机构不能发布需求
            // if(subUserType == 'TRAIN_ORG_TYPE'){
            // 	showToast("培训机构用户不能发布需求");
            //     return;
            // }
            var publishDemandObj = {
                title: title,
                tranPeopleNum: tranPeopleNum,
                connectPhone: connectPhone
            };
            localStorage.setItem("publishDemandObj", toJson(publishDemandObj));
            dsBridge.call("goImproveDemand", "");
        }



        function getServerDataSuccess(url, data) {
            switch (url) {
                case url_checkSMSVerifyCode:
                    $("#connectPhone").val($("#phoneNumber").val());
                    $('.dialog').addClass('hide')
                    $("#phoneNumber").val('');
                    $("#verifyCode").val('');
                    break;
                case url_sendVerifyCode:
                    verificationCodeTime();
                    break;
                case url_trandemandmgr_getTrainingNeedsIndex:
                    //统计
                    data = data.data;
                    $("#tranPeopleNums").text(data.tranPeopleNums);
                    $("#settledNum").text(data.settledNum);
                    $("#serviceTimes").text(data.serviceTimes);
                    break;
                case url_trainorgmgr_getTrainOrganization:
                    //优质培训服务机构
                    data = data.data;
                    var h5 = '';
                    if (data != null && data.length > 0) {
                        $.each(data, function (index, item) {
                            h5 += '<div class="pxindex-box">' +
                                '<div class="display-flex align-items-center justify-content-center padding-t-10">' +
                                '<img class="px-icon" src="../img/dress.png" alt=""><span class="font-15 font-weight blue2 elli1">' +
                                item.provinceName + '</span>' +
                                '</div>' +
                                '<p class="black font-15 text-center padding-t-10 elli1">' + item.number +
                                '个</p>' +
                                '</div>';
                        })
                    }
                    $("#goodOrgList").html(h5);
                    break;
                case url_trandemandmgr_queryList:
                    //对接成功案例
                    data = data.data;
                    var h5 = '';
                    if (data != null && data.length > 0) {
                        $.each(data, function (index, item) {
                            h5 +=
                                '<div class="trade-list widget-body widget-default margin-b-10 padding-t-10 trainDetail" id="' +
                                item.id + '">' +
                                '<p class="black font-15 font-weight elli1 padding-r-20">' + item.title +
                                '</p>' +
                                '<img class="pxsuccess-img" src="../img/px-success.png" alt="">' +
                                '<p class="font-13 gray no-margin">发起人：' + item.tranConnectPersion + '</p>' +
                                '<p class="font-13 gray">培训地址：' + item.tranAddressShow + '</p>' +
                                '<p class="text-right black font-15 no-margin">' + item.budgetShow +
                                '元<span class="gray font-13 margin-l-3">预算</span>' +
                                '</p>' +
                                '</div>';
                        })
                    }
                    $("#dataList").html(h5);
                    break;
            }
        }

        //详情
        mui("#dataList").on('tap', '.trainDetail', function () {
            localStorage.setItem("success-case-detail-id", $(this).attr("id"));
            dsBridge.call("goTrainSuccessCaseDetail", "");
        });

        //成功对接案例列表
        function goSuccessCaseList() {
            dsBridge.call("goSuccessCaseList", "");
        }

        //去机构信息维护-测试用
        function goOrgUpdate() {
            dsBridge.call("goOrgUpdate", "");
        }

        //去培训机构列表
        function goOrgList() {
            dsBridge.call("goOrgList", "");
        }

        //需求大厅
        function goDemandList() {
            dsBridge.call("goDemandList", "");
        }

        //修改手机号码
        $('.edit-phone').click(function () {
            $('.dialog').removeClass('hide')
        })
        $('.cancel-btn').click(function () {
            $('.dialog').addClass('hide')
            $("#phoneNumber").val('');
            $("#verifyCode").val('');
        })

        $('.cancel-btn-save').click(function () {
            var phoneNumber = $("#phoneNumber").val();
            var verifyCode = $("#verifyCode").val();
            if (isEmpty(phoneNumber)) {
                showToast("请输入手机号");
                return;
            }
            if (isEmpty(verifyCode)) {
                showToast("请输入验证码");
                return;
            }
            checkSMSVerifyCode(phoneNumber, verifyCode);
        })

        function verificationCodeTime() {
            $(".seed-btn").css("background", "#777");
            pWait = mWait;
            var interval = setInterval(function () {
                if (pWait == 0) {
                    $('.seed-btn').html("发送验证码")
                    $(".seed-btn").css("background", "#3F72FF");
                    clearInterval(interval);
                } else {
                    $(".seed-btn").html(pWait + 's');
                    pWait--;
                }

            }, 1000);
        }

        $('.seed-btn').click(function () {

            if ($('.seed-btn').html() == '发送验证码') {
                sendVerifyCode();
            }
        })
    </script>
</body>

</html>